<!-- NPM: From
     http://bestfromgoogle.blogspot.com/2011/05/google-chrome-speech-recognition-mashup.html
     TODO: get the speech-based search part working via Qt/QML -->
<html>
<head>
<title>Google Speech Recognition Mashup Google Maps</title>
<!-- NPM: #map_canvas sized for display on n950/Harmattan which is
     width: 854; height: 480; See also 'div id="map_canvas"' below -->
<style>
#map_canvas { 
  height: 410; 
  width : 854
  }
</style>
<link rel='stylesheet' href='../../api/styles/common.css' type='text/css' /> 
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript">
 
 function initialize() {
   geocoder = new google.maps.Geocoder();
    var latlng = new google.maps.LatLng(33.601880,-117.866679); //NPM: was -34.397, 150.644
    var myOptions = {
      zoom: 8,
      center: latlng,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    }
    map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
  }
 
 function codeAddress() {
    var address = document.getElementById("address").value;
    geocoder.geocode( { 'address': address}, function(results, status) {
      if (status == google.maps.GeocoderStatus.OK) {
        map.setCenter(results[0].geometry.location);
        var marker = new google.maps.Marker({
            map: map,
            position: results[0].geometry.location
        });
      } else {
        alert("Geocode was not successful for the following reason: " + status);
      }
    });
  }
</script>
</head>
<body onload="initialize()">
    <ul id="path">
      <li><img src="../../images/left_arrow_img.png" onclick="window.qml.showExampleChooser();"/></li>
      <li><input type="checkbox" onclick="window.qml.enableScroll(this.checked);"
		 class="flickable-checkbox"><span  onclick="(function() { var chk = $('input.flickable-checkbox')[0]; chk.click(); })();">Flickable??</span></input></li>
      <li><large>Google Maps</large></li>
    </ul>

  <div id="map_canvas" width="854" height="410">
</div>
<!-- NPM: x-webkit-speech doesn't work in QtWebKit -->
<input type="text" id="address" x-webkit-speech />
<input type="button" value="Show Location on Map" onclick="codeAddress();" />
</body>
</html>
